<!--领用单出库-->
<template>
  <div>
    <cus-modal ref="modal" title="领用单出库" @onOk="onOk" @on-visible-change="onVisibleChange" width="960">
      <cus-search style="margin: -30px 0 20px 0; padding: 20px 0 0 0">
        <cus-search-item>
          <Form class="flex" :model="form" :label-width="100" ref="formValidate" @keydown.native.enter.prevent="onInit">
            <FormItem label="领用单号" prop="billNo" class="mr_20 mb_20">
              <Input placeholder="请输入领用单号" clearable maxlength="20" v-model="form.billNo" />
            </FormItem>
            <FormItem label="领用单位" prop="recipientDepartmentId" class="mr_48 mb_20">
              <Select placeholder="全部" clearable v-model="form.recipientDepartmentId" style="width: 200px">
                <Option v-for="item in recipientDepartmentTree" :value="item.id" :key="item.id">{{ item.name }}</Option>
              </Select>
            </FormItem>
            <div style="display: flex">
              <cusButton class="mr_20 mb_20" type="primary"
                @onClick="getApiGoodsSelectNoDownloadAndNoOutStockbillSalesListApi()">查询</cusButton>
              <cusButton class="mr_20" type="primary" @onClick="reset()">重置</cusButton>
            </div>
          </Form>
        </cus-search-item>
      </cus-search>
      <Table border :loading="loading" :columns="columns" :data="data" :size="vuex_config.tableSize">
        <template slot-scope="{ row }" slot="operation">
          <div class="flex">
            <cus-button type="text" size="small" :style="{ color: '#1E6FFF' }" style="padding: 0 5px"
              @onClick="onEdit(row)">
              <Icon type="ios-download-outline" size="4" style="margin: 2px 3px 0 0" />
              <span>导入</span>
            </cus-button>
          </div>
        </template>
      </Table>
      <div class="mt_10" v-if="data.length > 0">
        <cus-page :data="pages" class="mt_10 flex_jd" @pageChange="
      getApiGoodsSelectNoDownloadAndNoOutStockbillSalesListApi()
      "></cus-page>
      </div>
      <div slot="footer">
        <slot name="footer">
          <!-- <div class="modal-footer">
          <cus-button size="small" class="mr_2" @onClick="onCancel"
            >取消</cus-button
          >
          <cus-button type="primary" size="small" @onClick="onCancel"
            >确认</cus-button
          >
        </div> -->
        </slot>
      </div>
    </cus-modal>
  </div>
</template>

<script>
import {
  getApiGoodsSelectNoDownloadAndNoOutStockbillSalesList,
  postApiGoodsInsertPoOutStockbillByPoOrderSales,
  getDepartmentOfCurrentUnit
} from "@/api/business/manager";

const columns = [
  {
    title: "序号",
    type: "index",
    minWidth: 70,
    align: "center",
  },
  {
    title: "领用单号",
    key: "billNo",
    minWidth: 145,
    align: "center",
  },
  {
    title: "创建时间",
    key: "createTime",
    minWidth: 175,
    align: "center",
  },
  {
    title: "领取数量",
    key: "goodsNum",
    minWidth: 100,
    align: "center",
  },
  {
    title: "领用单位",
    key: "recipientDepartmentName",
    minWidth: 100,
    align: "center",
  },
  {
    title: "操作",
    slot: "operation",
    minWidth: 95,
    fixed: "right",
    align: "center",
  },
];
const form = {
  id: "",
  billNo: "",         // 领用单号
  recipientDepartmentId: "",    // 领用单位
};
export default {
  name: "",
  computed: {},
  data() {
    return {
      loading: false,
      form: form,
      columns: columns,
      data: [],
      recipientDepartmentTree: [], // 领用单位Tree数据
      pages: {
        //分页
        page: 1,
        pageSize: 10,
        pageTotal: 0,
      },
    };
  },
  mounted() { },
  methods: {
    onVisibleChange() {
      this.$refs['formValidate'].resetFields();
      this.form = {
        id: "",
        billNo: "",         // 领用单号
        recipientDepartmentId: "",    // 领用单位
      }
    },
    show() {
      this.loading = false;
      this.$refs["modal"].show = true;
      this.getApiGoodsSelectNoDownloadAndNoOutStockbillSalesListApi();
      this.getDepartmentOfCurrentUnitApi();
    },
    reset() {
      this.$refs['formValidate'].resetFields();
      this.getApiGoodsSelectNoDownloadAndNoOutStockbillSalesListApi();
    },
    onOk() { },
    // 导入
    onEdit(row) {
      this.postApiGoodsInsertPoOutStockbillByPoOrderSalesApi(row.id);
    },
    // 取消
    onCancel() {
      this.$refs["modal"].show = false;
    },
    // 获取领用单出库数据-----------------------------------------接口
    getApiGoodsSelectNoDownloadAndNoOutStockbillSalesListApi() {
      this.loading = true;
      return new Promise((resolve) => {
        let params = {
          billNo: this.form.billNo,
          recipientDepartmentId: this.form.recipientDepartmentId,
          current: this.pages.page,
          size: this.pages.pageSize,
        };
        getApiGoodsSelectNoDownloadAndNoOutStockbillSalesList(params).then(
          (res) => {
            this.loading = false;
            if (res.retCode == 2000) {
              this.data = res.data.records;
              this.pages.pageTotal = res.data.total;
            }
            resolve();
          }
        );
      });
    },
    // 领用单出库-导入-------------------------------接口
    postApiGoodsInsertPoOutStockbillByPoOrderSalesApi(id) {
      this.loading = true;
      return new Promise((resolve) => {
        let params = {
          id: id,
        };
        postApiGoodsInsertPoOutStockbillByPoOrderSales(params).then((res) => {
          this.loading = false;
          if (res.retCode == 2000) {
            this.$Message.success(res.retMsg);
            this.$parent.postApiGoodsOutStockBillListApi(); //刷新出库列表
            this.getApiGoodsSelectNoDownloadAndNoOutStockbillSalesListApi(); //刷新领用单列表
          }
          resolve();
        });
      });
    },
    // 查询下级单位-------------------------接口
    getDepartmentOfCurrentUnitApi() {
      return new Promise((resolve) => {
        getDepartmentOfCurrentUnit().then((res) => {
          if (res.retCode == 2000) {
            this.recipientDepartmentTree = res.data;
          }
          resolve();
        });
      });
    }
  },
  computed: {},
  watch: {},
};
</script>

<style scoped></style>
